<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="/pageUtils/template.xhtml">

	<ui:define name="body">
		<h:form prependId="false">
			<div align="left">
				<p:messages id="messages" autoUpdate="true" />
				<p:panel header="Cadastro de eleitores" style="whidt:800px;">
					<h:panelGrid columns="6" id="painel" width="100%">

						<h:outputText value="Nome" />
						<p:inputText id="nome" value="#{eleitorController.eleitor.nome}"
							required="true" requiredMessage="o nome deve ser informado"
							label="o nome deve ser informado" maxlength="60"
							style="width:400px;" title="informe o nome do eleitor" />
						<p:tooltip for="nome" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Titulo" />
						<p:inputText id="titulo" maxlength="15" style="whidt:18;"
							required="true" requiredMessage="o titulo deve ser informado"
							value="#{eleitorController.eleitor.titulo}"
							title="informeo numero do titulo" />
						<p:tooltip for="rua" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Local" />
						<p:selectOneMenu value="#{eleitorController.local.id}"
							required="true" requiredMessage="o local deve ser informado"
							style="width:400px;">
							<f:selectItem itemLabel="Selecione o local" itemValue=""
								id="local" />
							<f:selectItems value="#{eleitorController.locais}" var="loc"
								itemLabel="#{loc.nome}" itemValue="#{loc.id}" />
						</p:selectOneMenu>
						<p:tooltip for="local" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Zona" />
						<p:inputText id="zona" value="#{eleitorController.eleitor.zona}"
							style="whidt:6;" required="true" maxlength="3"
							requiredMessage="a zona deve ser informada"
							title="informe o numero do zona" />
						<p:tooltip for="zona" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Responsavel" />
						<p:selectOneMenu value="#{eleitorController.responsavel.id}"
							required="true"
							requiredMessage="o responsavel deve ser informado"
							style="width:400px;">
							<f:selectItem itemLabel="Selecione o responsavel" itemValue=""
								id="resp" />
							<f:selectItems value="#{eleitorController.responsaveis}"
								var="item" itemLabel="#{item.nome}" itemValue="#{item.id}" />
						</p:selectOneMenu>
						<p:tooltip for="resp" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Secao" />
						<p:inputText id="secao" value="#{eleitorController.eleitor.secao}"
							required="true" requiredMessage="a secao deve ser informada"
							style="whidt:6;" maxlength="4" title="informe o numero do secao" />
						<p:tooltip for="secao" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Rua" />
						<p:inputText id="rua" value="#{eleitorController.eleitor.rua}"
							maxlength="30" title="informe a rua" />
						<p:tooltip for="rua" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Numero" />
						<p:inputText id="numero"
							value="#{eleitorController.eleitor.numero}" maxlength="6"
							style="whidt:6;" title="informe o numero da rua" />
						<p:tooltip for="numero" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Bairro" />
						<p:inputText id="bairro"
							value="#{eleitorController.eleitor.bairro}" maxlength="30"
							title="informe o bairro" />
						<p:tooltip for="bairro" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Celular" />
						<p:inputMask id="celular" style="whidt:12;"
							value="#{eleitorController.eleitor.celular}" maxlength="10"
							mask="(99) 9999-9999" title="informe o numero do celular" />
						<p:tooltip for="celular" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Residencial" />
						<p:inputMask id="residencial" style="whidt:12;"
							value="#{eleitorController.eleitor.residencial}" maxlength="10"
							mask="(99) 9999-9999"
							title="informe o numero do fone residencial" />
						<p:tooltip for="residencial" showEvent="focus" hideEvent="blur" />

						<h:outputText value="Comercial" />
						<p:inputMask id="comercial" style="whidt:12;"
							value="#{eleitorController.eleitor.comercial}" maxlength="10"
							mask="(99) 9999-9999" title="informe o numero do fone comercial" />
						<p:tooltip for="comercial" showEvent="focus" hideEvent="blur" />

						
					</h:panelGrid>
				</p:panel>
				<p:toolbar align="center">
					<p:toolbarGroup align="center">
						<p:commandButton value="Salvar" icon="ui-icon-disk"
							action="#{eleitorController.save()}" update="painelLista,painel" />

						<p:commandButton value="Novo" icon="ui-icon-document"
							action="#{eleitorController.clean()}" update="painel,messages"
							immediate="true" />

						<p:commandButton value="Imprimir" immediate="true"
							icon="ui-icon-print" ajax="false"
							action="#{eleitorController.print()}">
						</p:commandButton>

					</p:toolbarGroup>
				</p:toolbar>

				<h:panelGrid id="painelLista" style="width:800px;">
					<p:dataTable var="listEleitores" id="tableLista"
						value="#{eleitorController.eleitores}" paginator="true" rows="5"
						style="width:100%;">
						<p:column>
							<f:facet name="header">
								<h:outputText value="Nome" width="40%" />
							</f:facet>
							<h:outputText value="#{listEleitores.nome}" />
						</p:column>

						<p:column>
							<f:facet name="header" width="30%">
								<h:outputText value="Responsavel" />
							</f:facet>
							<h:outputText value="#{listEleitores.responsavel.nome}" />
						</p:column>

						<p:column width="15%">
							<p:commandButton title="Editar" update="painel" immediate="true"
								action="#{eleitorController.editar}" ajax="false"
								icon="ui-icon-folder-open">
								<f:setPropertyActionListener
									target="#{eleitorController.selected}" value="#{listEleitores}" />
							</p:commandButton>
						</p:column>

						<p:column>
							<p:commandButton title="Deletar" update="tableLista" ajax="false"
								action="#{eleitorController.deletar}" icon="ui-icon-close">
								<f:setPropertyActionListener
									target="#{eleitorController.selected}" value="#{listEleitores}" />
							</p:commandButton>
						</p:column>

					</p:dataTable>
				</h:panelGrid>
			</div>
		</h:form>
	</ui:define>
</ui:composition>